<template>
	<view class="pages u-flex-column">
		<view class="search_warp">
			<view class="search u-flex-y-center u-flex-between">
				<view class="u-flex-y-center">
					<view class="search_img">
						<image :src="`${$http_cos}/static/search.png`"></image>
					</view>
					<input type="number" v-model="id" placeholder="输入编号" @blur="onSearch"
						@keyup.enter.native="$event.target.blur()" />
				</view>
				<view class="search_btn" @keyup.enter.native="onSearch">
					<text>搜索</text>
				</view>
			</view>
		</view>
		<view style="width:750rpx;height:96rpx;"></view>
		<view class="list" v-if="proData.length>0">
			<view class="item u-flex-between u-flex-y-center" v-for="(item,index) in proData" :key="index"
				@click="skip(item)">

				<view class="u-flex-column item_botton_text">
					<text>红娘{{item.userId}}</text>
				</view>
				<view class="u-flex-xy-center">
					<view @click.stop.prevent="">
						<u-switch v-model="item.status==1?true:false" size="45" activeColor="#FF7612" asyncChange
							@change="asyncChange($event,item)"></u-switch>
					</view>
					<view class="u-flex-column  item_botton_text delate" @click.stop.prevent="delate(item)">
						<!-- <image src=""></image> -->
						<text>删除</text>
					</view>
				</view>

			</view>
		</view>
		<u-empty v-if="proData.length==0" textSize='30' mode="data" width="200" height="200"
			icon="https://hl-1316403513.cos.ap-shanghai.myqcloud.com/static/%E6%95%B0%E6%8D%AE%E4%B8%BA%E7%A9%BA.png">
		</u-empty>
		<view class="inquiry_warp">
			<view class="inquiry_btn u-flex-xy-center" @click="invite('/pages/agent_publishing/index')">
				<text>邀请代理红娘</text>
			</view>
		</view>

		<show-modal></show-modal>
	</view>
</template>

<script>
	import {
		getDeputyBasicList,
		delDeputy,
		setDeputyStatus
	} from '@/common/api.js'
	const app = getApp()
	export default {
		data() {
			return {
				current: 0,
				id: '',
				tab_list: [{
					name: '恋爱中',
					status: 3
				}, {
					name: '分手了',
					status: 4
				}],
				$http_cos: app.$http_cos,
				proData: [],
				page: 1,
				count: 0,
				perPage: 10,
				num_id: 0,
			}
		},
		watch: {
			id(val) {
				this.num_id = val
			}

		},
		onLoad() {
			this.get_DeputyBasicList()
		},
		onShow() {

		},
		onReachBottom() {
			this.get_DeputyBasicList()
		},
		methods: {
			asyncChange(e, item) {
				let that = this
				this.$showModal({
					title: '',
					content: e ? '确定开启吗？' : '确定要关闭吗？',
					cancelText: "取消",
					confirmText: "确定",
					success(res) {
						if (res.confirm) {
							let data = {
								userId: item.userId,
								status: e ? 1 : 0
							}
							setDeputyStatus(data, {
								custom: {
									auth: false,
									toast: false,
									catch: false
								}
							}).then((result) => {
								uni.showToast({
									icon: 'success',
									duration: 2000,
									title: e ? '开启成功' : '关闭成功',
									success: () => {
										setTimeout(() => {
											that.init()
										}, 1000)
									}
								});

							}).catch((err) => {

							})
						} else if (res.cancel) {
							console.log('用户点击取消')
						}
					}
				})

			},
			invite(url) {
				console.log(url)
				uni.navigateTo({
					url: url
				})
			},
			skip(item) {
				uni.navigateTo({
					url: '/pages/agent_publishing/index?userId=' + item.userId + '&type=编辑'
				})
			},
			onSearch() {
				this.init()
			},
			init() {
				this.page = 1
				this.proData = []
				this.count = 0
				setTimeout(() => {
					this.get_DeputyBasicList()
				}, 200)
			},
			delate(it) {
				let that = this
				this.$showModal({
					title: '',
					content: '确定要删除吗?',
					cancelText: "取消",
					confirmText: "确定",
					success(res) {
						if (res.confirm) {
							let data = {
								userId: it.userId,
							}
							delDeputy(data, {
								custom: {
									auth: false,
									toast: false,
									catch: false
								}
							}).then((result) => {
								uni.showToast({
									icon: 'success',
									duration: 2000,
									title: '删除成功',
									success: () => {
										setTimeout(() => {
											that.init()
										}, 1000)
									}
								});
							}).catch((err) => {

							})
						} else if (res.cancel) {
							console.log('用户点击取消')
						}
					}
				})
			},
			get_DeputyBasicList() {
				let data = {
					params: {
						id: this.num_id,
						page: this.page,
						perPage: this.perPage,
					}
				}
				getDeputyBasicList(data, {
					custom: {
						auth: false,
						toast: false,
						catch: false
					}
				}).then((result) => {
					this.proData = [...this.proData, ...result.list]
					this.count = result.count
					// result.list.length <= 0 ? this.status = 'noMore' : this.status = 'more'
					this.page++;
				}).catch((err) => {

				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.pages {
		overflow: hidden;
		height: calc(100vh - 70px);

		.search_warp {
			padding: 12rpx 24rpx;
			box-sizing: border-box;
			background-color: #fff;
			position: fixed;
			left: 0;
			right: 0;
			top: 0;

			// height: 176rpx;
			/deep/ .u-tabs__wrapper__nav__item {
				flex: 1;
				padding: 0;

				&__text {
					font-size: 28rpx;
				}
			}

			.search {
				position: relative;
				width: 100%;
				background: #F9F9F9;
				border-radius: 36rpx;
				padding: 0 30rpx 0 32rpx;
				box-sizing: border-box;
				height: 72rpx;

				.search_img {
					width: 36rpx;
					height: 36rpx;
					margin-right: 8rpx;
				}

				input {
					font-size: 28rpx;
					color: #C9C9C9;
				}

				.search_btn {
					padding: 0 24rpx;
					box-sizing: border-box;
					position: relative;

					&::after {
						content: '';
						position: absolute;
						left: 0;
						top: 0;
						width: 2rpx;
						height: 100%;
						background: #E5E5E5;
						-webkit-transform: scaleX(.5);
						transform: scaleX(.5);
					}

					text {
						font-size: 28rpx;
						font-weight: 400;
						color: #111111;
					}
				}
			}
		}

		.list {
			padding: 20rpx;
			box-sizing: border-box;
			flex: 1;
			overflow-y: scroll;

			.item {

				background-color: #fff;
				border-radius: 20rpx;
				margin-bottom: 16rpx;
				height: 130rpx;
				padding: 0 32rpx 0 43rpx;
				box-sizing: border-box;

				&:last-child {
					margin-bottom: 0;
				}

				.item_botton_text {
					&:last-child {
						text {
							color: #FF0000;
						}
					}

					text {
						font-size: 28rpx;
						font-family: Microsoft YaHei;
						font-weight: 400;
						color: #000000;

					}

					align-items: center;
				}

				.arrows {
					width: 74rpx;
					height: 44rpx;
					padding: 0 90rpx 0 79rpx;
				}

				.delate {
					margin-left: 20rpx;
				}
			}
		}

		.inquiry_warp {
			position: fixed;
			bottom: 0;
			left: 0;
			right: 0;
			height: 140rpx;
			background-color: #fff;
			padding: 24rpx;
			box-sizing: border-box;

			.inquiry_btn {
				background-color: #FF7612;
				border-radius: 20rpx;
				height: 100%;

				text {
					font-size: 30rpx;
					color: #fff;
				}
			}
		}

	}
</style>
